<template>
    <div class="leftTab">
        <ul class="nav nav-tabs" ref="nav">
            <li role="presentation" class="active"><a href="#"  @click="switchTab(0)">题目</a></li>
            <li role="presentation"><a href="#" @click="switchTab(1)">评论</a></li>
        </ul>
<!--        <ul class="nav nav-tabs" ref="nav">-->
<!--            <li @click="switchTab(0)" role="presentation" class="active">>题目</li>-->
<!--            <li  @click="switchTab(1)" role="presentation">评论</li>-->
<!--        </ul>-->
        <div v-if="current == 0">
            <div class="content__2ebE">
                <div class="notranslate" >
                    <div v-html="describe"></div>

                    <p><strong>示例:</strong></p>
                    <div v-html="example">
                    </div>
                </div>
            </div>

        </div>
        <div v-if="current == 1">这是评论呀</div>

    </div>

</template>

<script>
import 'bootstrap/dist/js/bootstrap.js'
import 'bootstrap/dist/css/bootstrap.css'
import constant from "@/constants/constant";


export default {
    name: 'leftTab',

    props: {
        describe: String,
        example: String
    },

    data() {
        return {
            currentDiv:0,
            current: 0,
        }
    },
    created() {
        console.log("this is leftTat")

    },
    methods: {
        switchTab(currentIndex) {
            var lis = this.$refs.nav.children
            for (let i = 0; i < lis.length; i++) {
                if (i ==  currentIndex) {
                    lis[i].setAttribute("class", "active")
                } else {
                    lis[i].setAttribute("class", "")
                }
            }
            this.current = currentIndex

        }
    }

}


</script>

<style>
/*.nav {*/
/*    display: flex;*/
/*    margin: 0px;*/
/*    padding: 0px;*/
/*}*/
/*.nav > li {*/
/*    float: left;*/
/*    flex: 0 1 120px;*/
/*    max-width: 160px;*/
/*    background-color: #42b983;*/
/*}*/
/*.isActivity {*/
/*    background-color: beige;*/
/*}*/

</style>